<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0">
		<title></title>
	</head>
	<style>
	  *{padding: 0;margin: 0;}
	  .box{
	    width: 200px;
	    height: 200px;
	    background: #ccc;
	    position: absolute;
	  }
	</style>
	<body>
	  <div class="box"></div>
	  <script>
	    let boxDom = document.querySelectorAll(".box")[0];
	    console.log(boxDom)
	    boxDom.addEventListener("touchstart",function(e){
	      let left = e.targetTouches[0].pageX - this.offsetLeft;
	      let top = e.targetTouches[0].pageY - this.offsetTop;
	      
	      function move(e){
	        this.style.left = e.targetTouches[0].pageX -left+"px";
	        this.style.top = e.targetTouches[0].pageY -top+"px";
	      }
	      function end(e){
	        boxDom.removeEventListener("touchmove",move,false) 
	        boxDom.removeEventListener("touchend",end,false) 
	      }
	      
	      boxDom.addEventListener("touchmove",move,false);
	      boxDom.addEventListener("touchend",end,false);
	    },false)
	  </script>
	</body>
</html>
